﻿
<!DOCTYPE HTML>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>I was within and without.</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="format-detection" content="telephone=no">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
<meta name="full-screen" content="yes">
<meta name="browsermode" content="application">
<meta name="x5-orientation" content="portrait">
<meta name="x5-fullscreen" content="true">
<meta name="x5-page-mode" content="app">
<link href="/index/css/animate.css" rel="stylesheet">
<script src="/static/js/jquery-1.9.1.js"></script>
<script src="/index/js/jquery.lettering.js"></script>
<script src="/index/js/jquery.textillate.js"></script>
<script  type="text/javascript"  src="/index/js/banner.js"></script>
<link type="text/css" rel="stylesheet" href="/index/css/banner.css" />

<script>
    $(function () {
        showText('.text1',1000);
        showText('.text2',3000);
        showText('.text3',7000);
        showText('.text4',9000);
        showText('.text5',11000);
        showText('.text6',13000);
        showText('.text7',15000);
        showText('.text8',17000);
    });

    showText = function(c,time){
        $(c).textillate({
            initialDelay: time, 	//设置动画开始时间
            in: { effect: 'flipInX'	//设置动画名称
            }
        });
    }
</script>
<style type="text/css">
    body {background:#242424;}
    p {width:auto;margin:0 auto;}
    .text {visibility:hidden;}
    .text {color:#fff;}
    .text {letter-spacing:3px;}
    .text {font-family:microsoft yahei;font-size:14px;line-height:24px;text-shadow:0.1em 0.1em 0.1em rgba(0, 0, 0, 0.8)}
    center {position:fixed;bottom:30px;text-align:center;width:100%;}
    center a {margin:20px; color:#666;text-decoration:none;}
    center a:hover {margin:20px; color:#666;text-decoration:underline;}
    .text-r {text-align: right;}
    .bigbanner{
        width: 100%;
        height: 200px;
        margin:0 auto;

    }
    .clear {
        clear: both;}
</style>
<body>
<div>

    <div class="bigbanner">
        <div id="banners">
            <div class="banner current" id="banner-1"><a href="#"  target="_self" title="了不起的盖茨比" ><img alt="了不起的盖茨比" src="/index/images/1.png" /></a></div>
            <div class="banner" id="banner-2"><a href="#"  target="_self" title="了不起的盖茨比" ><img alt="了不起的盖茨比" src="/index/images/2.png" /></a></div>
            <div class="banner" id="banner-3"><a href="#"  target="_self" title="了不起的盖茨比" ><img alt="了不起的盖茨比" src="/index/images/3.png" /></a></div>
            <div class="banner" id="banner-4"><a href="#"  target="_self" title="了不起的盖茨比" ><img alt="了不起的盖茨比" src="/index/images/4.png" /></a></div>
        </div>
        <ul id="controls">
            <li class="active"><a href="#" rel="banner-1"></a></li>
            <li><a href="#" rel="banner-2"></a></li>
            <li><a href="#" rel="banner-3"></a></li>
            <li><a href="#" rel="banner-4"></a></li>
        </ul>
    </div>
    <div class="clear"></div>
    <p class="text text1">I was within and without.</p>
    <br />
    <p class="text text2">世界不会在意你的自尊，人们看到的只是你的成就。在你没有成就以前，切勿过分强调自尊。</p>
    <br />
    <p class="text text3">我们奋力前行，逆水行舟，被不断向后推，直至回到往昔岁月。</p>
    <p class="text text4 text-r"> --了不起的盖茨比</p>
    <p class="text text5">老来多健忘，唯不忘相思。</p>
    <p class="text text6">念念不忘，必有回响。</p>
    <p class="text text7">...</p>


</div>
<script type="text/javascript">
    $.post("/api/visitRecord/add",{},function(obj){
    })
</script>
</body>
</html>
